.subject {
    .top {
        display: flex;
        align-items: center;
        margin-top: 20px;
        justify-content: space-between;

        .left {
            display: flex;
            align-items: center;

            span {
                color: #888;
            }
        }
    }

    ul {
        list-style: none;
        display: flex;
        justify-content: space-between;

        li {
            margin-right: 10px;
            float: left;
            width: 405px;
            height: 426px;
            background: #f0f9f4;
            transition: all .4s;
            position: relative;

            &:hover {
                transform: scale(102%);
                box-shadow: 0 0 11px #ccc;
            }

            img {
                width: 100%;
                height: 356px;
            }

            .info {
                position: absolute;
                bottom: 100px;
                left: 15px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding-right: 40px !important;
                width: 100%;

                .summary {
                    color: #888;

                }
            }

            p {
                margin: 0;
                padding: 0;
                font-size: 20px;
                width: 246px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                color: #fff;
            }

            .price {
                color: red;
                padding: 5px 10px;
                border-radius: 5px;
                background: #fff;

            }
        }
    }

    .icon {
        display: flex;
        margin-top: 20px;
        .icon-left {
            display: flex;
      
            justify-content: space-between;

            small {
                font-size: 16px;
                margin-left: 20px;
            }
        }

        .icon-right {
            flex: 1;
            display: flex;
            margin-right: 20px;
            justify-content: end;
          
            small{
                font-size: 16px;
            }
        }
    }
}